<template>
  <ElDrawer v-model="visible">
    <ElForm>
      <ElFormItem label="单号">
        <ElTag>{{ leaveBill.leaveBillCode }}</ElTag>
      </ElFormItem>
      <ElFormItem label="请假类型">
        <ElSelect v-model="leaveBill.leaveType">
          <ElOption label="病假" value="sick"></ElOption>
          <ElOption label="年假" value="annual"></ElOption>
          <ElOption label="事假" value="issue"></ElOption>
        </ElSelect>
      </ElFormItem>
      <!-- <ElFormItem label="请假时间">
        <ElDatePicker type="datetimerange" v-model="leaveBill.timeRange"></ElDatePicker>
      </ElFormItem> -->
      <!-- <ElDatePicker v-model="leaveBill.timeStart"></ElDatePicker>
      <ElDatePicker v-model="leaveBill.timeEnd"></ElDatePicker> -->
      <ElFormItem label="请假时间">
        <ElDatePicker type="datetimerange" v-model="timeStartEnd"></ElDatePicker>
      </ElFormItem>
      <ElFormItem label="请假原因">
        <ElInput v-model="leaveBill.reason"></ElInput>
      </ElFormItem>
      <ElFormItem>
        <ElButton @click="modify()" type="primary">修改请假条</ElButton>
      </ElFormItem>
    </ElForm>
  </ElDrawer>
</template>
<script lang="ts">
import type { LeaveBill } from '@/views/LeaveApply.vue'

/**
 * 页面核心数据结构体说明文档
 *
 *
 */
// import from

export default defineComponent({
  name: 'LeaveModifyEx',
  emits: ['postModify'],
  props: {
    sampleP: {
      type: Number,
      default: 0
    }
  },
  data() {
    return {
      sampleD: 'value',
      visible: false,
      leaveBill: {
        //    leaveBillCode: ""
        //   leaveType: null,
        //   timeStart:  null,
        //   timeEnd:  null
      } as LeaveBill
    }
  },
  computed: {
    /* sampleC() {
      return this.sampleD + "--";
    }, */

    timeStartEnd: {
      get() {
        if (this.leaveBill.timeStart && this.leaveBill.timeEnd) {
          return [this.leaveBill.timeStart, this.leaveBill.timeEnd]
        } else {
          return null
        }
      },
      set(timeStartEnd_: any) {
        if (timeStartEnd_) {
          this.leaveBill.timeStart = timeStartEnd_[0]
          this.leaveBill.timeEnd = timeStartEnd_[1]
        } else {
          this.leaveBill.timeStart = null
          this.leaveBill.timeEnd = null
        }
      }
    }
  },
  created() {},
  mounted() {},
  methods: {
    // sampleM() {},
    show(d: LeaveBill) {
    //   console.log(d)
      this.leaveBill = d
      this.visible = true
    },
    async modify() {
      // 格式化
      //   const t = {
      //     leaveType: this.leaveBill.leaveType,
      //     timeStart: this.leaveBill.timeStart,
      //     timeEnd: this.leaveBill.timeEnd,
      //     reason: this.leaveBill.reason
      //   }
      const t = {
        leaveType: 'sick',
        timeStart: null,
        timeEnd: null,
        reason: ''
      }
      //   for (let key in t) {
      //     t[key] = this.leaveBill[key]
      //   }
      //   t.xreason=this.leaveBill.reason
      //   Object.keys(t).forEach((key) => {
      //     t[key] = this.leaveBill[key]
      //   })
      // ['leaveType','timeStart']

      const result = lodash.pick(this.leaveBill, Object.keys(t))
    //   console.log(result)
      const res = await axios({
        method: 'put',
        url: '/leave/modify/' + this.leaveBill.leaveBillCode,
        data: result
      })
      this.visible = false
      this.$emit('postModify', 1)
    }
  },
  watch: {
    // sampleP(n, o) {},
  }
})
</script>

<!--<style scoped>-->
<style lang="scss" scoped></style>
